﻿@using Ext.Net.MVC
@using Ext.Net
@model IEnumerable<SocialGame.Models.FieldsModel>
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_BaseLayout.cshtml";
}
@section headtag
{
    <script>
        var onWrite = function (store, operation) {
            var record = operation.getRecords()[0],
                name = Ext.String.capitalize(operation.action),
                verb;
            if (name == 'Destroy') {
                record = operation.records[0];
                verb = 'Đã xóa';
            } else {
                verb = name + 'd';
            }
            Ext.net.Notification.show({ title: name, html: Ext.String.format("{0} Lĩnh vực: {1}<br/>{2}", verb, record.getId(), operation.resultSet.message) });
        };
    </script>
}
@section content
{
    @(
     
 Html.X().Viewport().Layout(LayoutType.Fit).
 Items(
 Html.X().GridPanel()
            .Icon(Icon.Table)
            .Frame(true)
            .Title("Lĩnh vực")
            .Height(400)
            .Width(500)
            .Store(
                Html.X().StoreForModel().Control(s =>
                {
                    s.AutoSync = true;
                    s.Proxy.Add(
                        new RestProxy
                        {
                            AppendAction = false,
                            Reader = { 
                                new JsonReader {
                                    Root = "data",
                                    MessageProperty = "message"
                                }
                            },
                            API =
                            {
                                Read = Url.Action("Read"),
                                Update = Url.Action("Update"),
                                Create = Url.Action("Create"),
                                Destroy = Url.Action("Destroy")
                            },
                            Writer = {
                                new JsonWriter
                                {
                                    AllowSingle = true
                                }
                            }
                        }
                    );
                    s.Listeners.Write.Fn = "onWrite";
                })
            )
            .ColumnModel(
                Html.X().ColumnFor(Model, m => m.Id)
                    .ToBuilder<Column.Builder>().Text("Mã")
                    .Width(40),

               Html.X().ColumnFor(Model, m => m.FieldName)
                    .ToBuilder<Column.Builder>().Text("Tên lĩnh vực")
                    .Flex(1)
                    .Editor(
                        Html.X().TextField().AllowBlank(false)
                    )
            )
            .TopBar(
                Html.X().Toolbar()
                    .Items(
                        Html.X().Button()
                            .Text("Thêm")
                            .Icon(Icon.Add)
                            .Handler("this.up('grid').store.insert(0, new FieldData());this.up('grid').editingPlugin.startEdit(0, 0);"),
                        Html.X().Button()
                            .ItemID("btnRemove")
                            .Text("Xóa")
                            .Icon(Icon.Exclamation)
                            .Handler("this.up('grid').deleteSelected();")
                    )
            )
            .Plugins(
                Html.X().RowEditing()
                    .Listeners(l =>
                    {
                        l.CancelEdit.Handler = "if(e.record.phantom){e.store.remove(e.record);}";
                    })
            )
    ))
}
